<template>
  <div ref="dom"></div>
</template>

<script>
import echarts from "echarts";
import { on, off } from "@/libs/tools";
export default {
  name: "serviceRequests",
  props: {
    option: {
      type: Object
    }
  },
  data() {
    return {
      dom: null
    };
  },
  methods: {
    resize() {
      this.dom.resize();
    }
  },
  watch: {
    option: {
      //深度监听，可监听到对象、数组的变化
      handler(newV, oldV) {
        this.dom = echarts.init(this.$refs.dom);
        this.dom.setOption(newV);
      },
      deep: true
    }
  },
  mounted() {
    this.$nextTick(() => {
      this.dom = echarts.init(this.$refs.dom);
      //  for( let h =0; h<this.option.series.length;h++){
      //      this.option.series[h].type='bar';
      //   }
      this.dom.setOption(this.option);
      on(window, "resize", this.resize);
    });
  },
  beforeDestroy() {
    off(window, "resize", this.resize);
  }
};
</script>
